<template>
	<view>
		<uni-popup ref="upadd" background-color="#fff" border-radius="20px 20px 0px 0" type="bottom">
			<image v-if="type==1" mode="widthFix" src="/static/danciimg.png" class="image posiab top0 left0"></image>
			<view v-if="type==1" class="con pt40 posire" :style="{paddingBottom:bhh+'px'}">
				<view class="flex-ju-b">
					<view class="size36 bold">
						将单词添加到
					</view>
					<view @click="$refs.upadd.close()">
						<image mode="widthFix" src="/static/closes.png" class="image  width65"></image>
					</view>
				</view>
				<scroll-view scroll-y class="height540rpx">
				 <view @click="tapaddfavorits(item)" v-for="(item,index) in folder" :key="index" class="size28 flex-a-i border-bECEDEE pb30 mt30">
					<image mode="widthFix" class="image width48 mr10" src="/static/dancien.png"></image>
					{{item.favoriteFolderName}}
					<view v-if="item.isDefault" class="color999 bgF3F5F7 ra10 pg2-5 size22 ml10">默认</view>
				</view>
			 </scroll-view>
				<view @click="$refs.addcigen.open(),$refs.upadd.close()" class="size28 flex-ju-c  pb30 mt30 color666">
				<image mode="widthFix" class="image width32 flex mr5" src="/static/jiajia.png"></image>
					新建词本
				</view>
			</view>
			<image v-if="type==2" mode="widthFix" src="/static/cigenimg.png" class="image posiab top0 left0"></image>
			<view v-if="type==2" class="con pt40 posire" :style="{paddingBottom:bhh+'px'}">
				<view class="flex-ju-b">
					<view class="size36 bold">
						将词跟添加到
					</view>
					<view @click="$refs.upadd.close()">
						<image mode="widthFix" src="/static/closes.png" class="image  width65"></image>
					</view>
				</view>
				
				<scroll-view scroll-y class="height540rpx">
					<view @click="tapaddfavorits(item)" v-for="(item,index) in folder" :key="index" class="size28 flex-a-i border-bECEDEE pb30 mt30">
						<image mode="widthFix" class="image width48 mr10" src="/static/cigens.png"></image>
						{{item.favoriteFolderName}}
						<view v-if="item.isDefault" class="color999 bgF3F5F7 ra10 pg2-5 size22 ml10">默认</view>
					</view>
				</scroll-view>
				
			 
				<view @click="$refs.addcigen.open(),$refs.upadd.close()" class="size28 flex-ju-c  pb30 mt30 color666">
					<image mode="widthFix" class="image width32 flex mr5" src="/static/jiajia.png"></image> 新建词本
				</view>
			</view>
		</uni-popup>
		
		<uni-popup type="bottom" background-color="#fff" border-radius="20px 20px 0px 0" ref="addcigen">
			<view class="con pt40 " :style="{paddingBottom:bhh+'px'}">
				<view class="flex-ju-b">
					<view class="size36 bold color222">
						新建词本
					</view>
					<view @click="$refs.addcigen.close()">
						<image mode="widthFix" src="/static/closes.png" class="image  width65"></image>
					</view>
				</view>
				<view v-if="!xuexi" class="size28 flex-a-i  pb30 mt30">
					<view class="width190">
						词本类型：
					</view>
					<view @click="tapgen(2)"  :class="{active:tindex==2}" class="wh125-80 ra20 borderEBEFF0 flex-ju-c">词根本</view>
					<view @click="tapgen(1)" :class="{active:tindex==1}" class="wh125-80 ra20 borderEBEFF0 flex-ju-c ml20">单词本</view>
				</view>
				<view class="size28 flex-a-i  pb30 mt30">
					<view class="width190">
						词本名称：
					</view>
					<view class="flex-a-i height100 pl20 pr20 ra20 bgF3F5F7">
						<input v-model="favoriteName" maxlength="10" cursor-spacing="20" class="flex1" placeholder-style="color:#999;font-size:28rpx;" placeholder="词本名称不多于10个字" />
						<view class="color999 size28">{{favoriteName.length}}/10</view>
					</view>
					
				</view>
				<view class="size28 flex-a-i  pb30 mt30 mb30 sww">
					<view class="width190">
						设为默认单本
					</view>
					 <switch @change="switchch" class="vwswitch" color="#FD2F55" />
				</view>
				<view @click="tapadd" class="flex-ju-c colorfff bgFD2F55 height100 ra20">确认</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		name:"add",
		props:['type','wordId'],
		data() {
			return {
				tindex:2,
				xuexi:"",
				favoriteName:"",
				folder:[],
				isDefault:0
			};
		},
		
		methods: {
			tapaddfavorits(item){
				this.http('/api/folder_favorite_relation/add',{
					favoriteId:item.id,
					favoriteType:this.type,
					entryId:this.wordId,
					favoriteName:item.favoriteFolderName
				},'post').then(res=>{
					this.$emit('collection')
					this.$refs.upadd.close()
				})
			},
			tapadd(){
				this.http('/api/favorite_folder/add',{
					favoriteName:this.favoriteName,
					dictionaryType:this.tindex,
					isDefault:this.isDefault
				},'post').then(res=>{
					if(!this.xuexi){
						this.toast('新建成功')
					}
					this.$refs.addcigen.close()
					if(this.xuexi==1){
						var obj = {
							id:res.data,
							favoriteFolderName:this.favoriteName
						}
						this.tapaddfavorits(obj)
						
						// setTimeout(()=>{
						// 	this.tapaddfavorits()
						// },700)
						// setTimeout(()=>{
						// 	this.$emit('collection',this.tindex)
						// },700)
					}else{
						setTimeout(()=>{
							this.$emit('collection',this.tindex)
						},700)
					}
				})
			},
			switchch(e){
				if(e.detail.value){
					this.isDefault=1
				}else{
					this.isDefault=0
				}
			},
			tapgen(index){
				this.tindex = index
			},
			open(type){
				this.xuexi = type
				this.tindex = this.type
				this.http('/api/favorite_folder/page',{
					dictionaryType:this.type
				},'post').then(res=>{
					this.folder = res.data
					this.$refs.upadd.open()
				})
			},
			openc(){
				this.xuexi = ''
				this.tindex = this.type
				this.$refs.addcigen.open()
			}
		}
	}
</script>

<style>
.active{
	border:2px solid #FD2F55;
	color:#FD2F55;
}

</style>